// Created by liusc on 2020/8/5-9:24.
<template>
  <div class="budgetWrap">
    <div class="resource-manage">
      <div class="card-box">
        <div class="card-title">
          <span>模板信息</span>
        </div>
        <el-form ref="add-form" :model="form" :rules="rules" class="form-wrap" label-width="auto">
          <el-row>
            <el-col :span="8">
              <el-form-item label="模板名称" prop="templateName">
                <el-col class="in_txt">
                  {{
                  form.budgetTemplate.templateName
                  }}
                </el-col>
              </el-form-item>
            </el-col>

            <el-col :span="16">
              <el-form-item label="备注" prop="remarks">
                <el-col class="in_txt">
                  {{
                  form.budgetTemplate.remarks
                  }}
                </el-col>
              </el-form-item>
            </el-col>
          </el-row>

          <!-- 科目头部 -->
          <div class="header">
            <div class="subject">选择科目</div>
            <i @click="addSubjects" style="font-size:24px;  float: right; " class="el-icon-circle-plus"></i>
          </div>
          <div class="operation">
            <el-divider></el-divider>
            <div class="treeBox">
              <!-- 科目一二级树形结构 -->
              <el-tree :data="itemValueList" node-key="itemId" default-expand-all @current-change="handleCheckChange" :expand-on-click-node="true">
                <span class="custom-tree-node" slot-scope="{ node, data }">
                  <span style="width:25%;   font-weight: 700;">
                    <!-- <el-button 
                               type="danger"
                               plain
                    size="mini">删除</el-button>-->
                    {{ data.itemName }}
                    <span v-if="data.children==null" @click.stop="delObj(data.itemId)">
                      |
                      <el-link type="danger">删除</el-link>
                    </span>
                  </span>
                  <span style="width:25%; text-align: center; ">{{ data.itemValue }}</span>
                  <span style="width:25%; " class="inputbox">
                    {{ data.itemValuePre }}
                    <!-- <el-input type="number"
                          @input="budgetChange()"
                          readonly="readonly"
                    v-model="data.itemValuePre"></el-input>-->
                  </span>
                  <!-- 变化金额 -->
                  <span style="width:25%; text-align: center;">
                    <span v-if="data.changeAmount > 0">+</span>
                    {{ data.changeAmount }}
                  </span>
                </span>
              </el-tree>
            </div>
            <!--   -->
            <div class="operationBox" v-if="addAHidden">
              <el-row>
                <el-col :span="24">
                  <el-form-item label="科目名称" prop="courseTitle">
                    <el-col class="in_txt">
                      <el-input v-model="form.budgetTemplateItem.itemName" maxlength="100" placeholder="请输入内容"></el-input>
                    </el-col>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-form-item label="科目预警" prop="budgetTemplateItem.itemWarn">
                    <el-col class="in_txt">
                      <el-input suffix-icon="el-icon-date" v-model="form.budgetTemplateItem.itemWarn"></el-input>
                    </el-col>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-form-item label="是否为预算必选项" prop="checked">
                    <el-col class="in_txt">
                      <el-checkbox true-label="1" false-label="0" v-model="form.budgetTemplateItem.isNead"></el-checkbox>
                    </el-col>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-form-item label="描述" prop="describe">
                    <el-col class="in_txt">
                      <el-input placeholder="这里是描述信息" maxlength="100" v-model="form.budgetTemplateItem.remarks"></el-input>
                    </el-col>
                  </el-form-item>
                </el-col>
              </el-row>
            </div>
          </div>
        </el-form>
      </div>
    </div>
    <!-- 取消保存部分============================== -->
    <div slot="footer" class="footer" style="padding-right: 0px">
      <el-button @click="cancel">取 消</el-button>
      <el-button type="primary" v-throttle="[addCommit]">保 存</el-button>
    </div>
  </div>
</template>

<script src="./template_edit.js"></script>
<style lang="scss" scoped>
@import "./template_edit";
</style>
